<template>
  <div>
    <el-tabs v-model="activeName" @tab-click="handleClick" class="demo">
      <el-tab-pane label="处理中心" name="1">
        <el-form ref="formInfo1" :model="formInfo1" label-width="80px" class="form">
          <div class="div">
            <div class="item">供应商名称</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">统一社会信用代码</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">单位注册地</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">机构类型</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">企业性质</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">成立日期</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">工作单位</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">法人/负责人身份证号</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">单位联系地址</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div class="div">
            <div class="item">经营范围</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div class="div">
            <div class="item">公司简介</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div class="div">
            <div class="item">营业执照扫描件</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">营业执照有效期</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">法人/负责人身份证扫描件</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div class="div">
            <div class="item"
              style="background-color: white;border: 1px solid #f2f2f2;color: red;font-size: 12px;line-height: 50px;">
              注：开票信息专用</div>
            <input type="text" disabled="true">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div class="div">
            <div class="item">开户行</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">银行账号</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">开户行地址</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">单位注册电话</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">单位注册地址</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">注册资本(万元)</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item">实缴资本(万元)</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>

          <div class="div">
            <div class="item">开户许可证/基本户存款信息证明</div>
            <input type="text" disabled="true" v-model="this.formInfo1.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>

          <div style="width: 100%;margin-top: 30px;margin-bottom: 30px;">
            <h2 style="float: left;"><b>审核意见：</b></h2>
            <textarea name="" id="" cols="125" rows="5" placeholder="请输入审核意见" v-model="this.formInfo1.name"></textarea>
          </div>

          <el-button type="primary" style="margin-left: 400px;">通过</el-button>
          <el-button type="danger">驳回</el-button>
          <el-button>取消</el-button>
        </el-form>
      </el-tab-pane>

      <el-tab-pane label="业务经办人信息" name="2">
        <el-form ref="formInfo1" :model="formInfo2" label-width="80px" class="form">
          <div class="div">
            <div class="item">姓名</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>
          <div class="div">
            <div class="item">身份证号</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>

          <div class="div">
            <div class="item">手机号</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>
          <div class="div">
            <div class="item">邮箱</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>

          <div class="div">
            <div class="item">身份证扫描件</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>
          <div class="div">
            <div class="item">授权书扫描件</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>

          <div class="div">
            <div class="item">座机</div>
            <input type="text" disabled="true" v-model="this.formInfo2.name">
          </div>
          <div class="div">
            <div class="item" style="background-color: white;border: 1px solid #f2f2f2;"></div>
            <input type="text" disabled="true">
          </div>
        </el-form>
      </el-tab-pane>

      <el-tab-pane label="核心技术人员" name="3">
        <el-table :data="formInfo3" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="180"></el-table-column>
          <el-table-column prop="name" label="姓名" width="180"></el-table-column>
          <el-table-column prop="zhiwei" label="职位" width="180"></el-table-column>
          <el-table-column prop="xueli" label="学历" width="180"></el-table-column>
          <el-table-column prop="zhicheng" label="职称" width="180"></el-table-column>
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button size="mini" type="text" @click="update(scope.row)">编辑</el-button>
              <el-button size="mini" type="text" @click="deletes(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>

      <el-tab-pane label="企业资质" name="4">
        <el-table :data="formInfo4" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="160"></el-table-column>
          <el-table-column prop="name" label="证书名称" width="180"></el-table-column>
          <el-table-column prop="zsId" label="证书编号" width="180"></el-table-column>
          <el-table-column prop="danwei" label="发证单位" width="180"></el-table-column>
          <el-table-column prop="getTime" label="发证日期" width="180"></el-table-column>
          <el-table-column prop="endTime" label="有效期至" width="180"></el-table-column>
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button size="mini" type="text" @click="update(scope.row)">编辑</el-button>
              <el-button size="mini" type="text" @click="deletes(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>

      <el-tab-pane label="业绩" name="5">
        <el-table :data="formInfo5" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="160"></el-table-column>
          <el-table-column prop="danwei" label="采购单位" width="180"></el-table-column>
          <el-table-column prop="hezuo" label="合作方" width="180"></el-table-column>
          <el-table-column prop="time" label="签订日期" width="180"></el-table-column>
          <el-table-column prop="money" label="合同金额(万元)" width="180"></el-table-column>
          <el-table-column prop="maifang" label="买方业务代表" width="180"></el-table-column>
          <el-table-column prop="phone" label="买方业务代表联系方式" width="180"></el-table-column>
          <el-table-column prop="phone" label="合同扫描件" width="180"></el-table-column>
        </el-table>
      </el-tab-pane>

      <el-tab-pane label="财务状态" name="6">
        <el-table :data="formInfo6" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="160"></el-table-column>
          <el-table-column prop="danwei" label="年度" width="180"></el-table-column>
          <el-table-column prop="hezuo" label="净利率(万元)" width="180"></el-table-column>
          <el-table-column prop="time" label="资产负债率(%)" width="180"></el-table-column>
          <el-table-column prop="money" label="财务审计报告扫描件" width="180"></el-table-column>
          <el-table-column prop="maifang" label="附件审计报告" width="180"></el-table-column>
          <el-table-column prop="phone" label="资产负债表扫描件" width="180"></el-table-column>
          <el-table-column prop="phone" label="利润表扫描件" width="180"></el-table-column>
          <el-table-column prop="phone" label="现金流量表扫描件"></el-table-column>
        </el-table>
      </el-tab-pane>

      <el-tab-pane label="相关附件" name="7">
        <el-table :data="formInfo7" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="160"></el-table-column>
          <el-table-column prop="danwei" label="年度" width="180"></el-table-column>
          <el-table-column prop="hezuo" label="净利率(万元)"></el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  export default {
    name: 'review',
    data() {
      return {
        key: '审核页',
        activeName: '1',
        formInfo1: {},
        formInfo2: {},
        formInfo3: [
          { id: 1 },
          { id: 2 }
        ],
        formInfo4: [
          { id: 1 },
          { id: 2 }
        ],
        formInfo5: [
          { id: 1 },
          { id: 2 }
        ],
        formInfo6: [
          { id: 1 },
          { id: 2 }
        ],
        formInfo7: [
          { id: 1 },
          { id: 2 }
        ],
      }
    },
    components: {

    },
    props: [],
    mounted() {

    },
    methods: {
      handleClick(tab, event) {
        console.log(tab, event);
      },
      update(row) {
        console.log(row)
      },
      deletes(row) {
        console.log(row)
      }
    }
  }
</script>

<style scoped>
  .demo {
    width: 80%;
    margin-left: 10%;
    font-size: 14px;
  }

  .form {}

  .div {
    display: inline-block;
    height: 40px;
    width: 50%;
  }

  .item {
    height: 100%;
    width: 40%;
    text-align: center;
    line-height: 40px;
    background-color: #f2f2f2;
    float: left;
    clear: both;
  }

  input {
    width: 60%;
    height: 100%;
    border: 1px solid #f2f2f2;
    background-color: white;
  }
</style>
